<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>分步注册页面</title>
<style type="text/css">
	html,body{
		padding:0px;
		margin:0px;	
	}
	#head div{
		float: left;
		border:2px solid #000;
		width: 25%;
		margin-left: 5px;
		margin-top: 10px;
		font-size: 18px;
		padding:1px 5px;
	}
	#contact{
		width: 80%;
		float: left;
		clear: left;
		margin-left: 5px;
		margin-top: 10px;
	}
	#contact legend{
		font-weight: bold;	
	}
	#contact table{
		padding-left: 30px;
		padding-top: 20px;
		margin-bottom: 50px;
		width: 100%;
		text-align: right;	
	}
	#contact td.ft{
		text-align: left;
		padding-left: 15px;
	}
	#contact #back{
		margin-left: 20px;
		float:left;
	}
	#contact #proceed{
		margin-right: 20px;
		float: right;
	}
</style>
</head>
<body>
	<div id="head">
		<div><p>Login details</p></div>
		<div style="background-color:#CCC;"><p>Contact details</p></div>
		<div><p>Confirm details</p></div>
	</div>
	<fieldset id="contact">
		<legend>Contact details:</legend>
		<form action="#" method="post">
			<table>
				<tr>
					<td><label for="txt_addr_1">Address 1: </label></td>
					<td class="ft"><input type="text" id="txt_addr_1" size="30" /></td>
				</tr>
				<tr>
					<td><label for="txt_addr_2">Address 2: </label></td>
					<td class="ft"><input type="text" id="txt_addr_2" size="30" /></td>
				</tr>
				<tr>
					<td><label for="txt_ts">Town/Suburb: </label></td>
					<td class="ft"><input type="text" id="txt_ts" size="15" /></td>
				</tr>
				<tr>
					<td><label for="txt_cs">City/State: </label></td>				
					<td class="ft"><input type="text" id="txt_cs" size="15" /></td>
				</tr>
				<tr>
						<td><label for="txt_pzc">Postal/Zip Code</label></td>			
						<td class="ft"><input type="text" id="txt_pzc" size="15" /></td>	
				</tr>
			</table>

			<input id="back" type="button" id="btn_back" value="Back" />
			<input id="proceed" type="button" id="btn_proceed" value="Proceed" />
		</form>
	</fieldset>
	<p style="float:left;clear:left;margin-left:5px;color:red;">* = required</p>
</body>
</html>